<template>
  <div>
    <el-dialog 
      :visible.sync="dialogVisible"
      width="50%"
      :show-close="false"
      :close-on-click-modal="false"
      @cancel='cancel'
    >
      <el-tabs type="border-card">
        <el-tab-pane label="登录" v-if="isShow">
          <login-view :isShow='isShow' @changeCode='changeCode' @cancel='cancel'></login-view>
        </el-tab-pane>
        <el-tab-pane label="验证码登录" v-else>
          <code-login @cancel='cancel' @changeCode='changeCode'></code-login>
        </el-tab-pane>
        <el-tab-pane label="注册">
            <register-view></register-view>
        </el-tab-pane>        
      </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
import loginView from '@/views/Dialog/login.vue'
import registerView from './register.vue'
import codeLogin from './codeLogin.vue'
export default {
  name:'',
  data() {
    return {
      isShow:true
    }
  },
  props:{
    dialogVisible:Boolean
  },
  components:{
    loginView,
    registerView,
    codeLogin
  },
  // updated() {
  //   console.log('我是每次更新的');
  //   console.log(this.dialogVisible);
  // },
  // mounted() {
  //   this.changeCode()
  // },
  methods: {
    changeCode(){
      this.isShow = !this.isShow
    },
    cancel(){
      console.log('点击关闭 --- dialog');
      this.$emit('cancel')
    }
   
  },
}
</script>

<style>

</style>